<template>
	<view class="icon" @tap="tap" :style="{ background: questionPress ? '#FF8B5E' : '#FED46B' }" hover-class="touch" hover-stay-time="300">
		<u-icon :name="questionPress ? 'pause-circle-fill' : 'play-circle-fill'"></u-icon>
	</view>
</template>

<script>
export default {
	props: ['questionPress'],
	methods: {
		tap: function() {
			this.$emit('iconTap')
		}
	}
}
</script>

<style scoped lang="stylus">
.icon
	width 80rpx
	height 80rpx
	position absolute
	right 30rpx
	bottom 30rpx
	z-index 99
	border-radius 50%
	font-size 50rpx
	line-height 80rpx
	text-align center
	box-shadow 0 0 2rpx white
	color white
	transition all 0.3s
	transform translate3d(0,0,0)
</style>
